<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>03_元素属性操作</title>
		<!-- 元素属性操作 ：针对元素中属性
		     元素：固定属性 attr()   removeAttr()针对元素自带属性，捆绑型
			      附件属性 prop()   removeprop()针对表单元素，附加型
				  特点：固定属性和附加属性【两对函数使用方式一致】
			prop()          功能：表单元素：input元素，添加获取属性值的方法
			                有参  传1个值
							语法:prop("属性")
							功能：表单元素中附加属性[checked、disabled]
							     添加bool布尔值，获取input元素布尔值
								 获取input元素中checked的布尔值
							      传2个值
							语法:prop("属性"，属性值：bool类型)
							功能：设置input元素值那个属性状态【true设置选中false未选中】
			removeProp()
		-->
		<script src="../js/jquery-1.11.1.js"></script>
	</head>
	<body>
		<h1>prop()函数与removeProp()函数的使用</h1>
		<!-- 复选框 id="myCheckbox" checked选中 -->
		学生<input type="checkbox"  id="myCheckbox" checked/>
		<button id="getPropBtn">获取属性</button>
		<button id="setPropBtn">设置属性</button>
		<button id="removePropBtn">移除属性</button>
		<div id="output"></div>
		<script>
			//3.删除属性
			$("#removePropBtn").click(function(){
				$("#myCheckbox").removeProp("checked")
				$("#output").text("input元素已经被移除")
			});
			
			
			//2.设置属性--实现多选划掉
			$("#setPropBtn").click(function(){
				$("#myCheckbox").prop("checked",false)
				$("#output").text("你获取的checked值:false");
			});
			
			//1.获取属性值---点击getPropBtn--获取input种checked值【布尔型】
			// output提示：你获取的checked的值是+变量
			$("#getPropBtn").click(function(){
				var mcb=$("#myCheckbox").prop("checked");
				$("#output").text("获取的checked的值是："+mcb);
			});
		</script>
	</body>
</html>